<template>
  <div>
    <!--条件-->
    <i-button type="primary" shape="circle" @click="refreshRoute">刷新路由</i-button>
    <i-button type="primary" shape="circle" @click="currentRoute">查看当前运行的路由详情</i-button>



    <i-table :columns="columns1" :data="data1"></i-table>
    <Page :total="pageData.total" :current="pageData.current" :page-size="pageData.size"
          show-elevator show-total @on-change="changePage">
    </Page>



    <!--查看系统当前使用的路由面板-->
    <Modal
      v-model="currDig"
      title="当前运行的路由信息"
      @on-ok="ok"
      @on-cancel="cancel" width="1200px">
      <Table :columns="columns2" :data="data2"></Table>
    </Modal>


  </div>
</template>

<script>
  import {dealPageData} from "@/utils/myPageUtil";
  import {Button} from "iview";
  import {routePage,refresh,currentRoutes} from '@/api/gatewayApi';
    export default {
        name: "gatewayAdmin",
      //用于刷新页面
      inject: ['reload'],
      data(){
          return {
            currDig:false,  //路由面板
            pageData:{
              total:0,
              current:1,
              size:10,
              data:[]
            },
            columns1: [
              {
                title: '路由名称',
                key: 'routeName'
              },
              {
                title: '路由id',
                key:"routeId"
              },
              {
                title: '断言',
                key: 'predicates'
              },
              {
                title: '过滤器',
                key: 'filters'
              },
              {
                title: '状态',
                key: 'status',
                render: (h, params) => {
                  if (params.row.status == 1) {
                    return h('span', '正常');
                  }else {
                    return h('span', '禁用');
                  }
                }
              },
              {
                title: '操作',
                key: 'action',
                width: 150,
                fixed: 'right',
                align: 'center',
                render: (h, params) => {
                  return h("div", [//渲染一个div标签
                    h(
                      Button,
                      {
                        props: {
                          type: "error",
                          size: "small"
                        },
                        on: {
                          click: () => {
                            //this.$Message.info("审核");
                          }
                        }
                      },
                      "审核"
                    ),
                  ]);
                }
              }
            ],
            data1: [],
            columns2: [
              {
                title: '断言',
                key: 'predicate'
              },
              {
                title: '路由id',
                key:"route_id"
              },
              {
                title: '过滤器',
                key: 'filters'
              },
              {
                title: 'uri',
                key: 'uri'
              },
              {
                title: '排序order',
                key: 'order'
              },
            ],
            data2:[]  //系统当前运行的路由信息
          }
      },
      methods:{
        refreshRoute(){
          //刷新路由
          refresh().then(res => {
            if(res.data.code == 200){
              this.$Message.info("系统路由刷新成功");
            }
          });
        },
        currentRoute(){
          //当前路由信息
          currentRoutes().then(res => {
            this.data2 = res.data;
          });
          //展示
          this.currDig = true;
        },
        ok () {
          this.$Message.info('点击了确定');
        },
        cancel () {
          this.$Message.info('点击了取消');
        },
        changePage(index){
          //加载分页数据
          routePage(index,this.pageData.size).then(res => {
            if(res.data.code == 200){
              //处理分页
              this.pageData = dealPageData(res.data);
              this.data1 = this.pageData.data;
            }
          })
        }
      },
      created(){
        //加载分页数据
        routePage(this.pageData.current,this.pageData.size).then(res => {
          if(res.data.code == 200){
            //处理分页
            this.pageData = dealPageData(res.data);
            this.data1 = this.pageData.data;
          }
        })
      }
    }
</script>

<style scoped>

</style>
